<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> 
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %> 
<%@ taglib uri="/struts-tags" prefix="s"%> 
<%@ page import="com.onlineMIS.ORM.entity.headQ.inventory.*"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="Cache" content="no-cache">
<meta http-equiv="expires" content="0">
<meta name="viewport"content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<%@ include file="../../common/StyleEUIMobile.jsp"%>
<style>
.datagrid-row-selected {
	background: #FFE4E1 !important;
}

.button {
	position: relative;
	left: 20px;
	width: 60px;
	height: 30px;
	font-size: 12px;
	background-color: #007bff;
	color: #fff;
	border: 1px solid #007bff;
	border-radius: 5px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
</style>
<script>
//待配状态
var wait = <%=InventoryOrder.STATUS_PDA_COMPLETE%>;
//正在配货中状态
var progress = <%=InventoryOrder.STATUS_PEIHUO_INPROCESS%>;
//配货完成
var complete = <%=InventoryOrder.STATUS_PEIHUO_COMPLETE%>;
var dataGrid;
var autoRefresher = null;
var baseUrl = "<%=request.getContextPath()%>";

function loadPeihuoOrder(orderId) {
		window.location.href = '<%=request.getContextPath()%>/actionIpad/hqIpadJSP!loadPeihuoOrder?formBean.orderId='+orderId;		 	
}


function searchHeadqCust(){
	var custName = $("#custName").val();
    $('#custDataGrid').datagrid({
     	
 		url : 'ipadJSON!listHeadqCust',
 		queryParams: {
 			'formBean.custName':custName,
 		},
 		fitColumns: true,
 		border : false,	
 		singleSelect:true,
 		rownumbers : true,
 		striped: true,
 		columns : [ [
  		    {
 				field : 'id',
 				title : '客户ID',			
 				width : '15%',
 				align: 'center'
 			},{	
 				field : 'name',
 				title : '客户名称',
 				width : '25%'
 			},{	
 				field : 'area',
 				title : '客户地区',
 				width : '25%',	
 				align: 'center'
 			},{	
 				field : 'pinyin',
 				title : '拼音',
 				width : '20%',	
 				align: 'center'
 			},{				
				field : 'action',
				title : '选择',
				width : '15%',
				align: 'center',
				formatter : function(value, row, index) {
				var str = '';
				str += $.formatString('<a href="#" onclick="selectCust(\'{0}\',\'{1}\');"><img border="0" src="{2}" /></a>', row.id,row.name,'<%=request.getContextPath()%>/conf_files/easyUI/themes/icons/add.png');
				
				return str;
			}},
 		]]
 	});
	
	 $.mobile.go('#p2');
	 
}

$(document).ready(function(){
	$('#tabs').tabs('select', 2);
	
	var startTime = $("#startDate").val();
	var endTime = $("#endDate").val();
	var custId = $("#clientId").val();

	dataGrid = $('#searchDataGrid').datagrid({	 	
	 		url : 'ipadJSON!searchInventoryOrders',
	 		queryParams: {
	 			'formBean.searchStartTime':startTime,
	 			'formBean.searchEndTime':endTime,
	 			'formBean.clientId':custId,
	 		},
	 		fitColumns: true,
	 		border : false,	
	 		singleSelect:true,
	 		rownumbers : true,
	 		striped: true,
	 		nowrap : false,
	 		columns : [ [
	 			{	
					field : 'statusS',
					title : '状态',
					width : '7%',
					align: 'center',
					formatter : function(value, row, index) {
						var str = "";
						var str = "";
						if(row.status == wait){
							var str = "<img border='0' src='<%=request.getContextPath()%>/conf_files/easyUI/themes/icons/wait.png' />";
						}else if(row.status == progress){
							var str = "<img border='0' src='<%=request.getContextPath()%>/conf_files/easyUI/themes/icons/progress.png' />";
						}else if(row.status == complete){
							var str = "<img border='0' src='<%=request.getContextPath()%>/conf_files/easyUI/themes/icons/complete2.png' />";
						}
							

					    	return str;
					}
				},{
					field : 'id',
					title : '单据号',			
					width : '15%',
					align: 'center',
					formatter: function(value) {
						  return '<div class="datagrid-cell" title="' + value + '">' + value + '</div>';
	          			}
				},{	
					field : 'orderStartDateS',
					title : '日期',			
					width : '15%',
					align: 'center'
				},{					
					field : 'custName',
					title : '客户',
					width : '27%',
					formatter: function(value) {
							  return '<div class="datagrid-cell" title="' + value + '">' + value + '</div>';
		            }
				},{						
					field : 'snums',
					title : '选货',
					width : '8%',	
					align: 'center'
				},{	
					field : 'distributionUser',
					title : '配货人',
					width : '12%',	
					align: 'center'
				},{	
	 				field : 'progress',
	 				title : '配货率',
	 				width : '10%',
	 				formatter: function (v, r, i) {	
	 					var htmlstr = "";
	 					if(v <= 60){
	 						 htmlstr = '<div class="easyui-progressbar progressbar easyui-fluid" style="width: 100%; height: 20px;">'
	 							  + '<div class="progressbar-value" style="width: '+v+'%; height: 20px; line-height: 20px; background-color:#FFC0CB;"> '
	 							  + '<div class="progressbar-text" style="width: ' + v+'%'+ '; height: 20px; line-height: 20px;background-color:#FFC0CB;">' + v+ '%</div>'
	 							  + '</div>'
	 							  + '</div>';
	 							  return htmlstr;	
	 					}else if(v<100 && v>60){
	 						 htmlstr = '<div class="easyui-progressbar progressbar easyui-fluid" style="width: 100%; height: 20px;">'
	 							  + '<div class="progressbar-value" style="width: '+v+'%; height: 20px; line-height: 20px; background-color:#FFDAB9;"> '
	 							  + '<div class="progressbar-text" style="width: ' + v+'%'+ '; height: 20px; line-height: 20px;background-color:#FFDAB9;">' + v+ '%</div>'
	 							  + '</div>'
	 							  + '</div>';
	 							  return htmlstr;	
	 					}else if(v==100){
	 						htmlstr = '<div class="easyui-progressbar progressbar easyui-fluid" style="width: 100%; height: 20px;">'
	 							  + '<div class="progressbar-value" style="width: '+v+'%; height: 20px; line-height: 20px; background-color:#90EE90;"> '
	 							  + '<div class="progressbar-text" style="width: ' + v+'%'+ '; height: 20px; line-height: 20px;background-color:#90EE90;">' + v+ '%</div>'
	 							  + '</div>'
	 							  + '</div>';
	 							  return htmlstr;	
	 					}					 
	 					 }
	 			}, {				
	 				field : 'action',
	 				title : '详情',
	 				width : '10%',
	 				align: 'center',
	 			    formatter : function(value, row, index) {
	 					var str = $.formatString('<a href="#" onclick="loadPeihuoOrder(\'{0}\');"><img border="0" src="{1}" title="详情"/></a>', row.id,'<%=request.getContextPath()%>/conf_files/easyUI/themes/icons/details.png');

				    	return str;	 			    	 
	 			}
	 		}]],
	 		onLoadSuccess: function() {
		        $('.datagrid-cell').tooltip({
		            position: 'bottom',
		            hideDelay: 200,
		            onShow: function() {
		                $(this).tooltip('tip').css('max-width', '500px'); // 自定义宽度
		                var tooltip = $(this); // 获取当前Tooltip实例
		                tooltip.data('timeoutId', setTimeout(function() {
		                  tooltip.tooltip('hide'); // 执行隐藏操作
		                }, 3000)); // 设置3秒后隐藏
		            },
		            onHide: function() { // 隐藏时清理定时器
		                clearTimeout($(this).data('timeoutId'));
		              }
		        });
		    },
		    onDblClickRow: function(index, row) {
		    	loadPeihuoOrder(row.id);		    			    
		    }
	 	});
	
	autoRefresher = setInterval("dataGrid.datagrid('reload')", 1000*30);
})

function searchOrder(){
	var startTime = $("#startDate").val();
	var endTime = $("#endDate").val();
	var custId = $("#clientId").val();
	$('#searchDataGrid').datagrid('reload', { 'formBean.searchStartTime': startTime,'formBean.searchEndTime':endTime, 'formBean.clientId':custId}); 
	
}

/**
 * 清除查询条件
 */
function clearSearch(){
	var custId = $("#clientId").val(0);
	$("#custName").textbox("setValue",'');
	searchOrder();
}

function goNoEquipped(){
	window.location.href = '<%=request.getContextPath()%>/actionIpad/hqIpadJSP!goNoEquipped';		 	
}

function goSearch(){

	$('#tabs').tabs('select', 'tab3'); 
	window.location.href = '<%=request.getContextPath()%>/actionIpad/hqIpadJSP!goSearch';	
}

function goAlread(){
	$('#tabs').tabs('select', 'tab3'); 
	window.location.href = '<%=request.getContextPath()%>/actionIpad/hqIpadJSP!goAlread';	
	
}

</script>
</head>
<body>
	<div class="easyui-navpanel">
		<header>
			<div class="m-toolbar">
				<div class="m-left">
					<a href="javascript:void(0)" class="easyui-linkbutton"
						data-options="iconCls:'icon-man',plain:true"><span>总部人员：<s:property
								value="formBean.userInfor.user_name" /></span></a>
				</div>
				<div class="m-right">
					<a onclick="loginOut();" href="javascript:void(0);"
						class="easyui-linkbutton m-back" plain="true" outline="true"><span>退出登录</span></a>

				</div>
			</div>
		</header>
		<div id="center" style="position: relative; top: 10px;left:5px;">

			<div>
				<div class="easyui-resizable"
					data-options="minWidth:50,minHeight:50"
					style="position: absolute; bottom: 10px; top: 2px; width: 98%; height: 55px; border: 1px solid #ccc; border-radius: 10px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);">
					<div style="position: relative;  left: 5%; top: 10px;border: 0px solid #ccc;">
						
						<s:textfield id="startDate" name="formBean.searchStartTime"
							cssClass="easyui-datebox" data-options="width:100,editable:false" />
						至
						<s:textfield id="endDate" name="formBean.searchEndTime"
							cssClass="easyui-datebox" data-options="width:100,editable:false" />
							
						<strong>客户：</strong>
						<s:textfield cssClass="easyui-searchbox" id="custName"
							data-options="prompt:'请输入客户姓名',searcher:searchHeadqCust"
							size="25" />
						<input id="clientId" name="formBean.clientId" type="hidden" />
						<button style="position: relative; width: 50px; right: 10%;" class="button" onclick="searchOrder()">查询</button>	
					</div>
					<!-- 
					<div style="position: relative; width: 50%; left: 45%; top: -23px;border: 1px solid #ccc;">
						<strong>客户：</strong>
						<s:textfield cssClass="easyui-searchbox" id="custName"
							data-options="prompt:'请输入客户姓名',searcher:searchHeadqCust"
							size="25" />
						<input id="clientId" name="formBean.clientId" type="hidden" />
						<button style="position: relative; width: 50px; right: 10%;" class="button" onclick="searchOrder()">查询</button>
					</div>
					
					<br>
					<div style="position: relative; width: 50%; left: 10%; top: -22px;">
						<button class="button" onclick="searchOrder()">查询</button>
						<span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
						<button class="button5" onclick="clearSearch()">清除</button>

					</div> -->
				</div>

			</div>

			<div
				style="position: fixed; top: 120px; width: 100%; overflow: auto;">
				<hr>
				<span style="position: relative; top: -5px;">搜索单据：</span>
				<span><img border='0' src='<%=request.getContextPath()%>/conf_files/easyUI/themes/icons/wait.png' />待配单据    
				   <img border='0' src='<%=request.getContextPath()%>/conf_files/easyUI/themes/icons/progress.png' />正在配货中
				   <img border='0' src='<%=request.getContextPath()%>/conf_files/easyUI/themes/icons/complete2.png' />配货完成</span>
				<table id="searchDataGrid" class="easyui-datagrid"
					style="width: 98%; height: 750px;">

				</table>
			</div>

		</div>
		<%@ include file="../component/foot/Foot.jsp"%>

	</div>

	<div id="p2" class="easyui-navpanel">
		<header>
			<div class="m-toolbar">
				<div class="m-title">总部客户信息</div>
				<div class="m-left">
					<a href="#" class="easyui-linkbutton m-back"
						data-options="plain:true,outline:true,back:true">返回</a>
				</div>
			</div>
		</header>
		<div style="margin: 50px 0 0; text-align: center">
			<%@ include file="../component/HeadqCust.jsp"%>
		</div>
	</div>
</body>

</html>



